<template>
  <!-- 渲染虚拟dom的节点 -->
  <div id="container"></div>
  {{countTime}}
</template>

<script>
// createVNode  创建虚拟dom
// 参数1: String -> div/span/h1  Object -> 由组件实例对象产出的对象
// 参数2: {}  当我们参数1是普通标签节点时 可以配置dom属性  id class
//            当我们参数1是一个组件节点时 可以配置 props   type text
// 参数3: []  配置子节点

// render: 把生成好的虚拟dom渲染成真实dom
// render(Vnode, 真实的dom节点)

// import { createVNode, onMounted, render } from 'vue'

// 需求1: 创建一个文本内容为 '我真厉害' 的p标签虚拟节点 渲染到真实的container容器中

// 需求2: 创建一个如下的html嵌套结构
/*
   <div>
     <p>我是子节点</p>
   </div>
*/
// 在这里创建虚拟dom
import { useCountDown } from '@/compositions'
export default {
  setup () {
    const { countTime, start } = useCountDown(60)
    start()
    return {
      countTime
    }
  }
}
</script>
